import {Component, ViewEncapsulation, Input, Output, EventEmitter} from '@angular/core';

@Component({
    selector: 'ba-menu-item',
    encapsulation: ViewEncapsulation.None,
    styles: [require('./baMenuItem.scss')],
    template: require('./baMenuItem.html')
})
export class BaMenuItem {

    @Input()
    menuItem:any;
    @Input()
    child:boolean = false;

    @Output()
    itemHover = new EventEmitter<any>();
    @Output()
    toggleSubMenu = new EventEmitter<any>();

    public onHoverItem($event):void {
        this.itemHover.emit($event);
    }

  public changeHash(url): string {
      return '#' + url;
  }

    public onToggleSubMenu($event, item):boolean {
        $event.item = item;
        this.toggleSubMenu.emit($event);
        return false;
    }
}
